<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<header th:replace="shop/header::header-fragment"></header>
<link rel="stylesheet" th:href="@{/mall/styles/personal.css}">
<link th:href="@{/mall/css/bootstrap-modal.css}" rel="stylesheet">
<body class="hold-transition sidebar-mini">
<div class="wrapper">
    <!-- 引入页面头header-fragment -->
    <div th:replace="shop/header::header-nav"></div>
    <!-- 引入工具栏sidebar-fragment -->
    <div th:replace="shop/sidebar::sidebar-fragment(${path})"></div>
    <!-- Content Wrapper. Contains page content -->
    <div class="content-wrapper">
        <!-- Content Header (Page header) -->
        <div class="content-header">
            <div class="container-fluid">
            </div><!-- /.container-fluid -->
        </div>
        <section class="content">
            <div class="container-fluid">
                        <div class="card card-primary card-outline">
                            <div class="card-header">
                                <h3 class="card-title">基本信息</h3>
                            </div> <!-- /.card-body -->
                            <div class="card-body">
                                <div class="modal fade" id="personalInfoModal" tabindex="-1" role="dialog"
                                     aria-labelledby="personalInfoModalLabel">
                                    <div class="modal-dialog" role="document">
                                        <div class="modal-content">
                                            <div class="modal-header">
                                                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
                                                        aria-hidden="true">&times;</span></button>
                                                <h6 class="modal-title" id="personalInfoModalLabel">商品信息修改</h6>
                                            </div>
                                            <div class="modal-body">
                                                <form id="personalInfoForm">
                                                    <div class="form-group">
                                                        <label for="nickName" class="control-label">商铺名:</label>
                                                        <input type="hidden" id="shopUserId" th:value="${session.shopUser.shopUserId}">
                                                        <input type="text" class="form-control" id="nickName" name="nickName"
                                                               placeholder="请输入商铺名" th:value="${session.shopUser.nickName}"
                                                               required="true">
                                                    </div>
                                                    <div class="form-group">
                                                        <label for="shopIntro" class="control-label">商铺简介:</label>
                                                        <input type="text" class="form-control" id="shopIntro" name="shopIntro"
                                                               placeholder="请输入商铺简介" th:value="${session.shopUser.shopIntro}"
                                                               required="true">
                                                    </div>
                                                    <div class="form-group">
                                                        <label for="address" class="control-label">商铺地址:</label>
                                                        <input type="text" class="form-control" id="address" name="address"
                                                               placeholder="请输入收货信息" th:value="${session.shopUser.address}"
                                                               required="true">
                                                    </div>
                                                </form>
                                            </div>
                                            <div class="modal-footer">
                                                <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                                                <button type="button" class="btn btn-primary" id="saveButton">确认</button>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div id="personal">
                                    <div class="self-info center">
                                        <div class="intro fr" style="margin-left: 120px;">
                                            <div class="grzlbt ml40" style="margin-left: 30px;">商铺资料 <a href="javascript:openUpdateModal();"
                                                                             style="color:#1E90FF;margin-left: 600px;">更改商铺信息</a>
                                            </div>
                                            <div class="info_item ml40" style="margin-left: 20px;"><span style="width: 100px;">商铺名</span><span
                                                    th:text="${session.shopUser.nickName}">贵大云上商城</span>
                                            </div>
                                            <div class="info_item ml40" style="margin-left: 20px;"><span style="width: 100px;">手机号</span><span
                                                    th:text="${session.shopUser.loginName}">贵大云上商城</span>
                                            </div>
                                            <div class="info_item ml40" style="margin-left: 20px;"><span style="width: 100px;">密码</span><span>******</span>
                                            </div>
                                            <div class="info_item ml40" style="margin-left: 20px;"><span style="width: 100px;">商铺简介</span><span
                                                    th:text="${session.shopUser.shopIntro==''?'无':session.shopUser.shopIntro}">贵大云上商城</span>
                                            </div>
                                            <div class="info_item ml40" style="margin-left: 20px;"><span style="width: 100px;">商铺地址</span><span
                                                    th:text="${session.shopUser.address==''?'无':session.shopUser.address}">贵大云上商城</span></span>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
            </div><!-- /.container-fluid -->
        </section>
        <!-- /.content -->
    </div>
    <!-- /.content-wrapper -->
    <!-- 引入页脚footer-fragment -->
    <div th:replace="shop/footer::footer-fragment"></div>
</div>
<!-- jQuery -->
<script th:src="@{/admin/plugins/jquery/jquery.min.js}"></script>
<!-- Bootstrap 4 -->
<script th:src="@{/admin/plugins/bootstrap/js/bootstrap.bundle.min.js}"></script>
<!-- AdminLTE App -->
<script th:src="@{/admin/dist/js/adminlte.min.js}"></script>
<script th:src="@{/mall/js/bootstrap3.js}"></script>
<script th:src="@{/admin/plugins/sweetalert/sweetalert.min.js}"></script>
<script type="text/javascript">
    function openUpdateModal() {
        $('#personalInfoModal').modal('show');
    }

    //绑定modal上的保存按钮
    $('#saveButton').click(function () {
        var address = $("#address").val();
        if (address.trim().length < 10) {
            swal("请输入正确的商铺地址", {
                icon: "error",
            });
            return;
        }
        var shopIntro = $("#shopIntro").val();
        if (shopIntro.trim().length < 4) {
            swal("请输入正确的商铺简介", {
                icon: "error",
            });
            return;
        }
        var nickName = $("#nickName").val();
        if (nickName.trim().length < 2) {
            swal("请输入正确的商铺名", {
                icon: "error",
            });
            return;
        }
        var shopUserId = $("#shopUserId").val();
        var data = {
            "shopUserId": shopUserId,
            "address": address,
            "shopIntro": shopIntro,
            "nickName": nickName
        };
        $.ajax({
            type: 'POST',//方法类型
            url: '/shop/update',
            contentType: 'application/json',
            data: JSON.stringify(data),
            success: function (result) {
                if (result.resultCode == 200) {
                    $('#personalInfoModal').modal('hide');
                    window.location.reload();
                } else {
                    $('#personalInfoModal').modal('hide');
                    alert(result.message);
                }
                ;
            },
            error: function () {
                alert('操作失败');
            }
        });
    });
</script>
</body>
</html>